/**
 * 进入页面后第一次请求
 */
function firstRequest() {
	layui.use(['laypage'], function() {
		var laypage = layui.laypage;
		
		$.ajax({
			type: "get",
			url: urls.sysUrl + "message/list/count",
			async: false,
			xhrFields: {
				withCredentials: true
			},
			success: function(res) {
				if (res.errorCode === 0) {
					$('#count').html(res.data);
				} else {
					$("#count").html("1");
				}
			}
		});
		
		//分页
		laypage.render({
			elem: 'demo2-2',
			count: $('#count').html(),
			theme: '#FFB800',
			jump: function(obj, first) {
				$.ajax({
					type: "get",
					url: urls.sysUrl + "message/list",
					async: true,
					data: {
						"page": obj.curr,
						"limit": obj.limit
					},
					xhrFields: {
						withCredentials: true
					},
					success: function(res) {
						if (res.code === 0) {
							$('#message-list').html("");
							for (let msg of res.data) {
								$('#message-list').append(
									"<li class='zoomIn article'><div class='comment-parent'><a name='remark-1'></a><img src='" + msg.headPictureLink +
									"'/><div class='info'><span class='username'>" + msg.username + "</span><span id='commentTime'>" +
									timestampToDateTime(msg.createTime) + "</span></div><div class='comment-content'>" + msg.content +
									"</div></div></li>");
							}
						} else {
							$("#message-list").html("<h2><b>服务器异常!</b></h2>");
						}
					}
				});
			}
		});
	});
}

$(function() {
	firstRequest();
	layui.use(['element', 'jquery', 'form', 'layedit', 'flow'], function() {
		var element = layui.element;
		var form = layui.form;
		var $ = layui.jquery;
		var layedit = layui.layedit;
		var flow = layui.flow;
		//评论和留言的编辑器
		var editIndex = layedit.build('remarkEditor', {
			height: 150,
			tool: ['face', '|', 'link'],
		});
		//评论和留言的编辑器的验证
		form.verify({
			content: function(value) {
				value = $.trim(layedit.getContent(editIndex));
				if (value == "") return "请输入内容";
				layedit.sync(editIndex);
			},
			replyContent: function(value) {
				if (value == "") return "请输入内容";
			}
		});
		//回复按钮点击事件
		$('#message-list').on('click', '.btn-reply', function() {
			var targetId = $(this).data('targetid'),
				targetName = $(this).data('targetname'),
				$container = $(this).parent('p').parent().siblings('.replycontainer');
			if ($(this).text() == '回复') {
				$container.find('textarea').attr('placeholder', '回复【' + targetName + '】');
				$container.removeClass('layui-hide');
				$container.find('input[name="targetUserId"]').val(targetId);
				$(this).parents('.message-list li').find('.btn-reply').text('回复');
				$(this).text('收起');
			} else {
				$container.addClass('layui-hide');
				$container.find('input[name="targetUserId"]').val(0);
				$(this).text('回复');
			}
		});
		//监听提交
		form.on('submit(formLeaveMessage)', function(data) {
			layedit.sync(editIndex);
			$.ajax({
				type: "post",
				url: urls.sysUrl + 'message',
				async: true,
				data: JSON.stringify(data.field),
				contentType: "application/json; charset=utf-8",
				success: function(res) {
					if (res.errorCode === 0) {
						layer.msg(res.description, {
							icon: 6
						}, function() {
							// 刷新当前页面
							window.location.reload();
						});
					} else {
						layer.msg(res.description, {
							icon: 5
						});
					}
				}
			});
			return false;
		});
	});
});
